<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <title>音乐播放器</title>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        body{
            background-repeat:no-repeat;
            background-size:100% 100%;
            -moz-background-size:100% 100%;
            background-image: url("../static/img/6.jpg");
        }

        #Global {
            margin: 0 auto;
        }

        .index-top-left{
            width: 1000px;
            margin: 0 auto;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .index-top-right {
            background-color: #00f3ef;
            height: 30px;
            line-height: 30px;
            margin: 0 auto;
            opacity: 0.9;
        }

        .fun-home {
            width: 196px;
            height: 30px;
            text-align: center;
            display: inline-block;
            cursor: pointer;
        }

        .fun-home:hover {
            background-color: #27f9ff;
        }

        /*图标*/
        @font-face {
            font-family: 'iconfont';
            src: url('../iconfont/iconfont.eot');
            src: url('../iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
            url('../iconfont/iconfont.woff2') format('woff2'),
            url('../iconfont/iconfont.woff') format('woff'),
            url('../iconfont/iconfont.ttf') format('truetype'),
            url('../iconfont/iconfont.svg#iconfont') format('svg');
        }

        .iconfont {
            font-family: "iconfont" !important;
            font-size: 16px;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }


    </style>
</head>
<body>
<div style="width: 100%">

    <div id="Global">
        <div class="index-top-left">
            <img src="<%=request.getContextPath()%>/static/img/musicLOGO.png" alt="">
        </div>
        <div class="index-top-right">
            <div style="margin: 0 auto;width: 1000px">
                <div class="fun-home" id="a88" onclick="MusicHomeShow()">
                    <span class="iconfont">&#xe6a2;</span>
                    发现音乐
                </div>

                <div class="fun-home" onclick="MusicMoodShow()">
                    <span class="iconfont">&#xe69c;</span>
                    我的收藏
                </div>

                <div class="fun-home" onclick="ShortMessageShow()">
                    <span class="iconfont">&#xe67c;</span>
                    短消息
                </div>

                <div class="fun-home" onclick="ShareMusicShow()">
                    <span class="iconfont">&#xe6de;</span>
                    分享音乐
                </div>

                <div class="fun-home"  onclick="loginShow()" id="login-out">
                    <span class="iconfont">&#xe6e0;</span>
                    退出登录
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</body>
<script>
    //首页--%>
    function MusicHomeShow() {
        location.href = "<%=request.getContextPath()%>/FunctionPage/MusicHome.jsp"
    }

    //切换《短消息》页面--%>
    function ShortMessageShow() {
        location.href = "<%=request.getContextPath()%>/FunctionPage/ShortMessage.jsp"
    }

    //切换《分享》页面--%>
    function ShareMusicShow() {
        location.href = "<%=request.getContextPath()%>/FunctionPage/ShareMusic.jsp"
    }

    //切换《音乐收藏》页面--%>
    function MusicMoodShow() {
        location.href = "<%=request.getContextPath()%>/FunctionPage/MusicMood.jsp"
    }

    //个人中心弹出--%>
    function loginShow() {

        location.href = "<%=request.getContextPath()%>/loginout"



    }


</script>
</html>
